<div class="bpmn-controls bpmn-fit-to-view">
    <button
        [title]="'PROCESS_EDITOR.ACTIONS.FIT_VIEW_PORT' | translate"
        data-automation-class="fit-view-port-button"
        (click)="fitViewPort()">
        <mat-icon>control_camera</mat-icon>
    </button>
</div>

<div class="bpmn-controls bpmn-actions-controls">
    <button
        [title]="'PROCESS_EDITOR.ACTIONS.UNDO' | translate"
        data-automation-class="undo-button"
        (click)="undo()">
        <mat-icon>undo</mat-icon>
    </button>
    <hr>
    <button
        [title]="'PROCESS_EDITOR.ACTIONS.REDO' | translate"
        data-automation-class="redo-button"
        (click)="redo()">
        <mat-icon>redo</mat-icon>
    </button>
</div>

<div class="bpmn-controls bpmn-zoom-controls">
    <button
        [title]="'PROCESS_EDITOR.ACTIONS.ZOOM_IN' | translate"
        data-automation-class="zoom-in-button"
        (click)="zoomIn()">
        <mat-icon>add</mat-icon>
    </button>
    <hr>
    <button
        [title]="'PROCESS_EDITOR.ACTIONS.ZOOM_OUT' | translate" w
        data-automation-class="zoom-out-button"
        (click)="zoomOut()">
        <mat-icon>remove</mat-icon>
    </button>
</div>
